<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/testdriver.js"></script>
<script src="/resources/testdriver-vendor.js"></script>
<script src="resources/soft-navigation-helper.js"></script>
</head>
<body>
  <main id=main>
  <p><a id=firstlink>Click me!</a></p>
  <p><a id=secondlink>Then click me!</a></p>
  </main>
  <script>
    (async () => {
    if (test_driver) {
        const firstlink = document.getElementById("firstlink");
        const clickPromise = new Promise(r => {
          firstlink.addEventListener("click", r);
        });
        test_driver.click(firstlink);
        await clickPromise;
      }
    })();
    const secondlink = document.getElementById("secondlink");
    testSoftNavigation({
      addContent: () => {
        addImageToMain();
      },
      link: secondlink,
      test: "first interaction in the middle of a soft navigation"});
  </script>
</body>
</html>
